博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
3.5 Templates -- Binding Element Attributes(绑定元素属性)
阅读量:7070 次
发布时间:2019-06-28

本文共 1094 字,大约阅读时间需要 3 分钟。

一、概述

除了正常的文本,你可能还需要你的模板中包含的HTML元素的属性绑定到controller

1. 例如,设想controller有一个属性包含一个图片的URL:

生成的HTML:

2. 如果你绑定的是一个布尔值,它将会添加或者移除一个特定的属性。例如:

如果isAdministratortrue,Handlebars将会生成如下HTML元素:

如果是false

二、 添加data属性

1. 默认的,view helpers不接受data属性。例如:

{
{#link-to "photos" data-toggle="dropdown"}}Photos{
{/link-to}}{
{input type="text" data-toggle="tooltip" data-placement="bottom" title="Name"}}

渲染为HTML:

2. 有两种办法可以让它支持data属性。

  • 一种是添加一个属性绑定到view,例如Ember.LinkComponent或者Ember.TextFielw对特定的属性来说:
  • export default Ember.LinkComponent.reopen({  attributeBindings: ['data-toggle']});export default Ember.TextField.reopen({  attributeBindings: ['data-toggle', 'data-placement']});

    HTML:

  • 你也可以在base view中自动绑定data属性:
  • export default Ember.View.reopen({  init() {    this._super();    var self = this;    // bind attributes beginning with 'data-'    Ember.keys(this).forEach(function(key) {      if (key.substr(0, 5) === 'data-') {        self.get('attributeBindings').pushObject(key);      }    });  }});

转载于:https://www.cnblogs.com/sunshineground/p/5152885.html

你可能感兴趣的文章
AngularJs学习笔记--bootstrap
查看>>
String 、InputStream、Reader 的转换
查看>>
block的回调作用
查看>>
如何实现类似微信朋友圈的feed功能(第一版)
查看>>
安装NODEJS的三种方法
查看>>
如何让Mac完全读写NTFS格式分区
查看>>
百万级很快的分页联合
查看>>
手机内存卡修复工具软件大师免费试用版
查看>>
获取屏蔽符号<!-- -->屏蔽的字符串的代码
查看>>
struct和typedef struct
查看>>
Notification启动Activity, 恢复任务栈
查看>>
使用Python进行并发编程
查看>>
自动机器学习简述(AutoML)
查看>>
iPhone X适配
查看>>
虚拟化笔记
查看>>
[vim]-vim基础
查看>>
JAVA 8入门(一)Lambda表达式
查看>>
resin集成eclipse开发
查看>>
将Excel文件中的数据导入到mysql【Excel中拼sql】
查看>>
H5移动端知识点
查看>>